<template>
	<u-popup v-model="show" mode="bottom" border-radius="14" @close="close">
		<view class="popup">
			<view class="title">收银台</view>
			<view class="priceBox">
				<view class="priceTitle">待支付金额:</view>
				<view class="price">{{moneyFormats(totalPrice)}}</view>
			</view>
			<view class="line"></view>
			<view class="payBox">
				<view class="payItem" @click="$u.debounce(()=>{pay(1)},1000)">
					<view class="left">
						<image src="../../static/image/yue.png" mode="" class="icon"></image>
						<view class="name">余额支付</view>
					</view>
					<u-icon name="arrow-right" class="right"></u-icon>
				</view>
				<view class="payItem" @click="$u.debounce(()=>{pay(2)},1000)">
					<view class="left">
						<image src="../../static/image/weixin.png" mode="" class="icon"></image>
						<view class="name">微信支付</view>
					</view>
					<u-icon name="arrow-right" class="right"></u-icon>
				</view>
			</view>
		</view>
	</u-popup>
</template>

<script>
	import {paymentUniversal,paymentInfo} from '../../common/api.js'
	import WeixinJSBridge from 'weixin-js-sdk';
	var wx = require('weixin-js-sdk');
	export default {
		props:['orderNo','shopData','totalPrice'],
		data() {
			return {
				show: true
			}
		},
		onShow() {
			if(!uni.getStorageSync("token")){
				uni.navigateTo({
					url:'/pages/index/index'
				})
			}
		},
		methods: {
			pay(type){
				console.log(1,this.orderNo)
				// console.log(2,type)
				// return
				if(type==1){
					
					this.yuPay(type)
				}else if(type==2){
					
					this.wechatPay(type)
				}
				
			},
			yuPay(type){
				// uni.showToast({
				// 	title: '调试中',
				// 	icon: "none"
				// })
				// return
				// uni.redirectTo({
				// 	url: '/pages-send/orderInfo/orderInfo?id='+this.orderNo
				// });
				// return
				paymentUniversal({
					payable_type:'express',
					method:'balance',
					payable_id:this.orderNo,
					amount:this.totalPrice,
				}).then(res=>{
					console.log(res)
					if(res.code==10000){
						uni.showToast({
							title: '支付成功',
							icon: "none",
							duration:2000
						})
						setTimeout(()=>{
							// this.$emit('empty');
							uni.redirectTo({
								url: '/pages-send/orderInfo/orderInfo?id='+this.orderNo
							});
						},2000)
						
					}else{
						uni.showToast({
							title: res.message,
							icon: "none",
							duration:2000
						})
					}
				})
			},
			wechatPay(){
				// uni.showToast({
				// 	title: '调试中',
				// 	icon: "none"
				// })
				// return
				let that = this
				paymentInfo({
					order_id:that.orderNo
				}).then(res=>{
					console.log(res)
					if(res.code==10000){
						WeixinJSBridge.config({
							debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
							appId: res.data.app_id, // 必填，公众号的唯一标识
							timestamp: res.data.timestamp, // 必填，生成签名的时间戳String(Date.now())
							nonceStr: res.data.nonce_str, // 必填，生成签名的随机串
							signature: res.data.pay_sign, // 必填，签名，见附录1
							jsApiList: ['chooseWXPay'] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
						});
						WeixinJSBridge.ready(function() {
							WeixinJSBridge.checkJsApi({
								jsApiList: ['chooseWXPay'], // 需要检测的JS接口列表，所有JS接口列表见附录2,
								success: function(res) {
									console.log('22进来',res);
								},
								fail: function(res) {
									console.log(res);
								}
							});
							WeixinJSBridge.chooseWXPay({
								timestamp: res.data.timestamp, // 支付签名时间戳，注意微信jssdk中的所有使用timestamp字段均为小写。但最新版的支付后台生成签名使用的timeStamp字段名需大写其中的S字符
								nonceStr: res.data.nonce_str, // 支付签名随机串，不长于 32 位
								package: res.data.package, // 统一支付接口返回的prepay_id参数值，提交格式如：prepay_id=***）
								signType: res.data.sign_type, // 签名方式，默认为'SHA1'，使用新版支付需传入'MD5'
								appId: res.data.app_id,
								paySign: res.data.pay_sign, // 支付签名
								success: function(res) {
									console.log(res)
									uni.showToast({
										title: '支付成功',
										icon: "none",
										duration:2000
									})
									setTimeout(()=>{
										// this.$emit('empty');
										uni.redirectTo({
											url: '/pages-send/orderInfo/orderInfo?id='+that.orderNo
										});
									},2000)
								}
							});
						});
					}
				})
				return
				
			},
			close(){
				this.$emit('empty');
			},
			moneyFormats(value){
				let a=Number(value);  //转为数字格式
				
				let b=a.toLocaleString('zh', { style: 'currency', currency: 'CNY' });
				
				return b
			}
		}
		
	}
</script>

<style lang="scss" scoped>
	.popup{
		width: 750rpx;
		height: 600rpx;
		background: #fff;
		
		.title{
			padding:30rpx;
			font-size: 32rpx;
			font-family: PingFangSC-Medium, PingFang SC;
			font-weight: 600;
			color: #000;
			text-align: center;
			
		}
		.priceBox{
			margin: 10rpx;
			padding:30rpx;
			padding-top:0rpx;
			.priceTitle{
				font-size: 28rpx;
				font-family: PingFangSC-Medium, PingFang SC;
				font-weight: 500;
				color: #000;
			}
			.price{
				font-size: 38rpx;
				font-family: PingFangSC-Medium, PingFang SC;
				font-weight: 500;
				color: #ED4C4C;
				margin-top: 20rpx;
			}
		}
		.line{
			width: 100%;
			height: 20rpx;
			background: #F3F3F3;
		}
		.payBox{
			padding:0 30rpx;
			.payItem{
				width: 100%;
				// height: 80rpx;
				border-bottom: 1rpx solid rgba(0,0,0,.1);
				padding: 20rpx 0;
				display: flex;
				justify-content: space-between;
				align-items: center;
				.left{
					display: flex;
					flex-wrap: nowrap;
					align-items: center;
					.icon{
						width: 60rpx;
						height: 60rpx;
					}
					.name{
						margin-left: 20rpx;
						font-size: 28rpx;
						font-family: PingFangSC-Medium, PingFang SC;
						font-weight: 500;
						color: #000;
					}
				}
				.right{
					
				}
			}
		}
	}
</style>